<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="../css/moban.css">
    <script type="text/javascript" src="../js/moban.js"></script>
    <title>Document</title>
</head>

<body>
    <div class='onck' id="onck">
        <div>
            <div>
                <h2>选择城市</h2>
                <span class="fis">热门城市:</span>
                <span>北京</span>
                <span>上海</span>
                <span>深圳</span>
                <span>杭州</span>
            </div>
            <div>
                <ul>
                    <li><span>B</span>
                        <a href="#">北京</a>
                    </li>
                    <li><span>C</span>
                        <a href="#">成都</a>
                        <a href="#">重庆</a>
                    </li>
                    <li><span>D</span>
                        <a href="#">大连</a>

                    </li>
                    <li><span>G</span>
                        <a href="#">广州</a>

                    </li>
                    <li><span>H</span>
                        <a href="#">杭州</a>
                    </li>
                    <li><span>N</span>
                        <a href="#">南京</a>
                    </li>
                    <li><span>S</span>
                        <a href="#">上海</a>
                        <a href="#">深圳</a>
                        <a href="#">苏州</a>
                    </li>
                    <li><span>T</span>
                        <a href="#">天津</a>
                    </li>
                    <li><span>W</span>
                        <a href="#">武汉</a>
                    </li>
                    <li><span>X</span>
                        <a href="#">西安</a>
                    </li>
                    <li><span>Z</span>
                        <a href="#">郑州</a>
                    </li>
                </ul>
            </div>
            <div onclick="b()"><img src="../img/close.png" alt=""></div>
        </div>
    </div>
    <!-- 网页头 -->
    <header>
        <!-- 大的div宽为100%，高为40px -->
        <div>
            <!-- 包裹的div宽为1190px，高为父级的100% -->
            <div>
                <!-- 左边的div -->
                <div class="h_left">
                    <ul>
                        <li onclick="a()"><span><img src="../img/location.png" alt=""></span><span>北京</span></li>
                        <li><a href="#" onclick="cli()" id="index">首页</a></li>
                        <li onclick="search()" id="search"><a href="#">立即找房</a></li>
                        <li><a href="#">发布房源</a></li>
                        <li><a href="#">找室友</a></li>
                        <li><a href="#">下载APP</a></li>
                        <li><a href="#">伙伴登录</a></li>
                    </ul>

                </div>
                <!-- 右边的div -->
                <div class="h_right">
                    <ul>
                        <span><img src="../img/icon_people_white.png" alt=""></span>
                        <a href="#">注册</a>
                        <a href="#">登录</a>
                    </ul>
                </div>
            </div>
        </div>
    </header>
    <!-- 网页主体内容 -->
    <main>
        <div style="width: 1190px; height: 800px; margin: 0 auto;">
            <p style="text-align: center;line-height: 400px;height: 400px;margin: 0;padding: 0;font-size: 50px;">内容区域</p>
        </div>
    </main>
    <!-- 网页尾 -->
    <footer>
        <div class="f_up">
            <div>
                <div>
                    <img src="../img/tuzi@2x.png" alt="">
                </div>
                <div>
                    <img src="../img/dibu.png" alt="" style="height: 150px;">
                </div>
            </div>
        </div>
        <div class="f_down">
            <div>
                <div>
                    <div>
                        <p>热门城市租房</p>
                        <ul>
                            <li><a href="#">上海租房</a></li>
                            <li>
                                <a href="#">杭州租房</a></li>
                            <li>
                                <a href="#">深圳租房</a></li>
                            <li>
                                <a href="#">西安租房</a></li>
                            <li>
                                <a href="#">成都租房</a></li>
                            <li>
                                <a href="#">大连租房</a></li>
                            <li>
                                <a href="#">广州租房</a></li>
                            <li>
                                <a href="#">苏州租房</a></li>
                            <li>
                                <a href="#">天津租房</a></li>
                            <li>
                                <a href="#">重庆租房</a></li>
                            <li>
                                <a href="#">武汉租房</a></li>
                            <li>
                                <a href="#">郑州租房</a></li>
                            <li>
                                <a href="#">宁波租房</a></li>
                            <li>
                                <a href="#">嘉兴租房</a></li>
                            <li>
                                <a href="#">南昌租房</a></li>
                            <li>
                                <a href="#">北京租房</a></li>
                            <li>
                                <a href="#">清远租房</a></li>
                        </ul>
                    </div>
                    <div>
                        <p>推荐区域租房</p>
                        <ul>
                            <li>
                                <a href="#">朝阳</a>
                            </li>
                            <li><a href="#">海淀</a></li>
                            <li><a href="#">东城</a></li>
                            <li><a href="#">西城</a></li>
                            <li><a href="#">丰台</a></li>
                            <li><a href="#">通州</a></li>
                            <li><a href="#">石景山</a></li>
                            <li><a href="#">房山</a></li>
                            <li><a href="#">昌平</a></li>
                            <li><a href="#">大兴</a></li>
                            <li><a href="#">顺义</a></li>
                            <li><a href="#">密云</a></li>
                            <li><a href="#">柔化</a></li>
                            <li><a href="#">延庆</a></li>
                            <li><a href="#">平谷</a></li>
                            <li><a href="#">门头沟</a></li>
                        </ul>

                    </div>
                    <div>
                        <p>推荐类型租房</p>
                        <ul>
                            <li><a href="#">1号线</a></li>
                            <li><a href="#">2号线</a></li>
                            <li><a href="#">4号大兴线</a></li>
                            <li><a href="#">5号线</a></li>
                            <li><a href="#">6号线</a></li>
                            <li><a href="#">8号线</a></li>
                            <li><a href="#">10号线</a></li>
                            <li><a href="#">13号线</a></li>
                            <li><a href="#">14号线西段</a></li>
                            <li><a href="#">15号线</a></li>
                            <li><a href="#">八通线</a></li>
                            <li><a href="#">机场线</a></li>
                            <li><a href="#">昌平线</a></li>
                            <li><a href="#">亦庄线</a></li>
                            <li><a href="#">房山线</a></li>
                            <li><a href="#">14号线东段</a></li>
                            <li><a href="#">7号线</a></li>
                            <li><a href="#">9号线</a></li>
                            <li><a href="#">16号线</a></li>
                            <li><a href="#">西郊线</a></li>
                            <li><a href="#">燕房线</a></li>
                            <li><a href="#">S1号线</a></li>
                        </ul>
                    </div>
                    <div>
                        <p>推荐类型租房</p>
                        <ul>
                            <li><a href="#"><span></span>合租</a></li>
                            <li><a href="#"><span></span>整租</a></li>
                            <li><a href="#"><span></span>公寓</a></li>
                        </ul>
                    </div>
                </div>
                <div>
                    <div>
                        <div>
                            <ul>
                                <li><a href="#">关于巴乐兔</a>
                                    <p>伙伴登录</p>
                                    <p>网站地图</p>
                                    <p>巴乐兔社区</p>
                                </li>
                                <li>巴乐兔合作公寓
                                    <p>青年汇</p>
                                    <p>银桥公寓</p>
                                    <p>爱家精品公寓...</p>
                                </li>
                                <li>意见反馈
                                    <p>Mail:service@baletu.com</p>
                                    <p>联系巴乐兔</p>
                                    <p>10106006</p>
                                    <p>周一~周日8:00~23:00</p>
                                </li>
                            </ul>
                        </div>
                        <div>
                            <div>
                                <p>扫码下载巴乐兔APP</p>
                                <img src="../img/baletuLogo1.png" alt="">
                            </div>
                            <div>
                                <p>扫码下载巴乐兔APP</p>
                                <img src="../img/code.png" alt=""></div>
                        </div>

                    </div>
                    <div>
                        <p><span>©2015 上海万间信息技术有限公司</span><span><span>营业执照 </span><span>隐私政策 </span><span> 上海市张江高科晨晖路88号1号楼4层</span></span>
                        </p>
                        <p><span><img src="../img/gongan.png" alt="">沪公网安备31011502006937号</span><span>增值电信业务许可证: 沪B2-20170251</span></p>
                    </div>
                </div>
            </div>
        </div>
    </footer>
</body>

</html>